{% extends "layout.html" %}
{% block content %}
<div class="container">
    <div class="row">
        <div class="col">
            <h1>{{ user.login }}</h1>
        </div>
    </div>
    <div class="row">
        <div class="col">
            <p>{{ user.login  }} is a member since {{ user.created_at | datetimeformat }}.</p>
        </div>
    </div>
    <div class="row">
	<div class="col-md-5">
	    <h2>Contributions</h2>
	</div>
    </div>
    <div class="row">
        <div class="col">
            <h5>Managed projects</h5>
            <div id="list-managed-projects" class="list-group"></div>
        </div>
    </div>
    <div class="row">
        <div class="col">
            <br />
            <h5>Recently submitted projects</h5>
            <div id="list-submitted-projects" class="list-group"></div>
	    <p><a href="{{ url_for('projects_bp.list_projects', submitter=user.login)  }}">All submitted projects.</a></p>
        </div>
    </div>
</div><!-- /.container -->
<script>
$(document).ready(function() {
    var filters_managed = [{"name": "manager_id", "op": "eq", "val": {{ user.id }}}];
    $.ajax({
        url: "{{ url_for('projectapi0.projectapi',) }}",
        data: {"q": JSON.stringify({"filters": filters_managed})},
        dataType: "json",
        contentType: "application/json",
        success: function(projects) {
            projects.objects
            .sort(function (a, b) {
                return a.last_updated < b.last_updated ;
            })
            .map(function (project) {
                var cardHTML = projectTemplate({
                    'project_url': '/project/'+project.name,
                    'project_name': project.name,
                    'project_description': project.short_description,
                    'project_last_update': moment(project.last_updated).fromNow(),
                    'project_tags': project.tags != 0 ?
                                        '<i class="fa fa-tags" aria-hidden="true"></i>&nbsp;' +
                                        project.tags.reduce(function(acc, tag) {
                                            link = '<a href="/projects/?tag=' + tag + '" class="text-muted" style="text-decoration: none">' + tag + '</a>&nbsp;';
                                            return acc + link;
                                        }, '') : ''
                 });
                 $('#list-managed-projects').append(cardHTML);
            });
        }
    });

    var filters_submitted = [{"name": "submitter_id", "op": "eq", "val": {{ user.id }}}];
    $.ajax({
        url: "{{ url_for('projectapi0.projectapi',) }}",
        data: {"q": JSON.stringify({"filters": filters_submitted})},
        dataType: "json",
        contentType: "application/json",
        success: function(projects) {
            projects.objects
            .sort(function (a, b) {
                return a.last_updated < b.last_updated ;
            })
            .map(function (project) {
                var cardHTML = projectTemplate({
                    'project_url': '/project/'+project.name,
                    'project_name': project.name,
                    'project_description': project.short_description,
                    'project_last_update': moment(project.last_updated).fromNow(),
                    'project_tags': project.tags != 0 ?
                                        '<i class="fa fa-tags" aria-hidden="true"></i>&nbsp;' +
                                        project.tags.reduce(function(acc, tag) {
                                            link = '<a href="/projects/?tag=' + tag + '" class="text-muted" style="text-decoration: none">' + tag + '</a>&nbsp;';
                                            return acc + link;
                                        }, '') : ''
                 });
                 $('#list-submitted-projects').append(cardHTML);
            });
        }
    });
});
</script>
{% endblock %}
